<!--
 * @Description: 
 * @Author: charles
 * @Date: 2021-05-05 22:02:56
 * @LastEditors: 晋龍
 * @LastEditTime: 2022-01-10 20:14:37
-->
<template>
  <div ref="bottom2_container" id="container" style="height: 95%"></div>
</template>
<script>
import { Line } from '@antv/g2plot';
import {get} from '../../../utils/request'
import moment from "moment"
export default {
  data (){
    return{
       dataArr:[]
     }
  },
  created(){

  },
mounted(){
this.initData()
},
methods:{
  initData(){
    get('/dashboard/queryMouthData?engineer_id=1').then(res=>{
        
        this.dataArr = res.data
        this.initChart()
      })
  },
initChart(){
  const line = new Line(this.$refs.bottom2_container,{
   
    data:this.dataArr,
      xField: 'date',
      yField: 'value',
      seriesField: 'type',
      yAxis: {
        
      },
    
      legend: {
        position: 'bottom',
      },
      smooth: true,
    
     
      // @TODO 后续会换一种动画方式
      animation: {
        appear: {
          animation: 'path-in',
          duration: 5000,
        },
      },
    });
    line.render();
}
}
}
</script>

<style scoped>

</style>

